<template>
  <layout>
    <view class="mine p-32">
      <view class="userinfo flex">
        <image class="avatar" :src="userinfo.avatar || avatar"></image>
        <view class="flex f1 flex-c basic-info">
          <view class="flex flex-a flex-bt">
            <text @click="toLogin" class="fs-32 bold deep-dark">{{
              userinfo.nickName || "登录/注册"
            }}</text>
            <view class="flex setting">
              <image
                src="../../assets/images/icons/setting.png"
                mode="scaleToFill"
                style="width: 48rpx; height: 48rpx;margin-right: 16rpx;"
                @click="toSetting"
              />
              <image
                src="../../assets/images/icons/message.png"
                mode="scaleToFill"
                style="width: 48rpx; height: 48rpx"
                @click="toMessage"
              />
            </view>
          </view>
          <view v-if="userinfo.userId" class="id">
            ID:{{ userinfo.userId }}
          </view>
          <view v-if="userinfo.userId" class="id code flex flex-a flex-bt">
            <view class="flex flex-a flex-bt">
              <text>邀请码:{{ userinfo.inviteCode }}</text>
              <image
                src="../../assets/images/setting/copy.png"
                mode="scaleToFill"
                style="width: 24rpx; height: 24rpx; margin-right: 4rpx"
                class="copy"
                @click="onCopy(userinfo.inviteCode)"
              />
              <text @click="onCopy(userinfo.inviteCode)">复制</text>

            </view>
            <view @click="toUserinfo" class="edit fs-20 c-60 flex flex-a">编辑资料</view>
          </view>
        </view>
      </view>
      <Cellect :userinfo="userinfo" :asset="asset" />
      <!-- TODO:还原 -->
      <!-- <Wallet :userinfo="userinfo" /> -->
      <!-- <Team /> -->
      <!-- <Other /> -->
    </view>
  </layout>
</template>

<script>
import layout from "../../compennts/layout/index.vue";
import Cellect from "./components/Cellect.vue";
import Wallet from "./components/Wallet.vue";
import Team from "./components/Team.vue";
import Other from "./components/Other.vue";
import { getLocalUserInfo } from "../../assets/utils";
import { copyText } from "../../assets/utils";
// import
import { getUserInfo } from "../../api/auth";
export default {
  components: {
    layout,
    Cellect,
    Wallet,
    Team,
    Other,
  },
  data() {
    return {
      userinfo: {},
      asset:{},
      avatar:
        "https://pics0.baidu.com/feed/c9fcc3cec3fdfc03d55a8def9a045b98a4c2260a.jpeg@f_auto?token=54e954d26c6f5eca324eff464eb1d15b",
    };
  },
  onShow() {
    let token = uni.getStorageSync("token");
    if (!token) return (this.userinfo = {});
    this.userinfo = getLocalUserInfo();
    this.asset = this.userinfo.asset || {};
    getUserInfo().then((res) => {
      console.log(res);
      uni.setStorageSync("userInfo", JSON.stringify(res.data));
      this.userinfo = res.data;
      this.asset = res.data.asset;
    });
  },
  mounted() {},
  onReachBottom() {},
  onLoad() {},
  methods: {
    toLogin() {
      if (this.userinfo.userId) return;
      uni.navigateTo({
        url: "/pages/login/index",
      });
    },
    toUserinfo(){
      console.log('ppp')
      uni.navigateTo({
        url: "/pages/mine/setting/userinfo",
      });
    },
    openSchema(url) {
      console.log(url);
      const schema = schemas[url];
      plus.runtime.openURL(schema, function (error) {
        console.error("打开抖音失败: " + error);
      });
    },
    onCopy(text) {
      copyText(text);
    },
    toSetting() {
      uni.navigateTo({
        url: "/pages/mine/setting/index",
      });
    },
    toMessage() {
      uni.navigateTo({
        url: "/pages/mine/message/index",
      });
    },
  },
};
</script>

<style lang="less" scoped>
@import url("../../assets/styles/common.less");
.p-32 {
  padding: 0 32rpx;
  box-sizing: border-box;
}
.mine {
  line-height: 1;
  padding-bottom: 32rpx;
}
.basic-info {
  justify-content: center;
}
.userinfo {
  // position: sticky;
  // top:0;
  .avatar {
    width: 117rpx;
    height: 117rpx;
    border-radius: 50%;
    border: 3px solid #ffffff;
    margin-right: 20rpx;
  }
  .setting {
    float: right;
  }
  .id {
    color: rgba(7, 11, 28, 0.6);
    font-size: 24rpx;
  }
  .copy {
    margin-left: 18rpx;
  }
  .code{
    margin-top: 7rpx;
  }
  .edit{
    padding: 8rpx 24rpx;
    background: rgba(255,255,255,0.2);
    border-radius: 24rpx;
    height: 44rpx;
  }
}
</style>
